//Đây là các hàm dùng cho bản đồ động, dựa trên Google Map API 3

var map;
var infowindow = new google.maps.InfoWindow();
var geocoder = new google.maps.Geocoder();

function cm_load(id, type){ // Khởi tạo bản đồ
    var mapProp = {
        center:new google.maps.LatLng(21.0134670000, 105.7915160000), // vị trí ban đầu khi load map
        zoom:16, // Mức zoom mặc định khi load map
        mapTypeControl:false,
        mapTypeId:google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("cm_map"),mapProp); // khởi tạo map

    // Auto complete khi gõ từ khóa
    $("#search_address").autocomplete({
        //This bit uses the geocoder to fetch address values
        source: function(request, response) {
            console.log("xxx");
            geocoder.geocode( {'address': request.term }, function(results, status) {
                response($.map(results, function(item) {
                    return {
                        label:  item.formatted_address,
                        value: item.formatted_address,
                        latitude: item.geometry.location.lat(),
                        longitude: item.geometry.location.lng()
                    }
                }));
            })
        },
        //This bit is executed upon selection of an address
        select: function(event, ui) {
            var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
            var markert = new google.maps.Marker();
            markert.setPosition(location);
            markert.setMap(map);
            map.setCenter(location);
        }
    });

    // Search địa điểm
    $('#address_button').click(function(){
        var address = $('#search_address').val();
        geocoder.geocode({
                'address': address
            },
            function(results, status) {
                if(status == google.maps.GeocoderStatus.OK) {
                    new google.maps.Marker({
                        position: results[0].geometry.location,
                        map: map
                    });
                    map.setCenter(results[0].geometry.location);
                }
            });
        var center = map.getCenter();
        cm_getHotelJSON(center.hb, center.ib, map);
    });


    google.maps.event.addListener(map, "zoom_changed", function() { // thay đổi mức zoom
        var center = map.getCenter();
        cm_getHotelJSON(center.hb, center.ib, map);
    });
    google.maps.event.addListener(map, "mouseup", function() { // di chuyển trên bản đồ
        var center = map.getCenter();
        cm_getHotelJSON(center.hb, center.ib, map);
    });

    cm_getJSON(id, type, map);
}

function cm_getJSON(id, type, map) { // Lấy dữ liệu các khách sạn
    jQuery.post(WEB_DIR + "ajax.php?act=hotel&code=getDataForMap", {
        id:id,
        type:type
    }, function (data) {
        console.log(data);
        cm_processJSON(data, map, true);
    }, 'json');
}

function cm_getHotelJSON(lat, lng, map) { // load thêm khách sạn khi di chuyển trên bản đồ
    jQuery.post(WEB_DIR + "ajax.php?act=hotel&code=getDataForMapByLatLng", {
        lat:lat,
        lng:lng
    }, function (data) {
        console.log(data);
        cm_processJSON(data, map, false);
    }, 'json');
}

function cm_processJSON (data, map, load_type) { // Xử lý dữ liệu khách sạn, thêm marker trên bản đồ thêm infoWindow cho marker
    var markerx;
    for (i=0; i<data.lengh; i++){
        position = new google.maps.LatLng(data.data[i].latitude, data.data[i].longitude);
        type = data.data[i].type;

        var html = "<div class='item-hotel' style='font-size:12px; padding: 0; padding-left: 114px; width: 215px; min-height: 90px;'>";
        if(type == 'hotel') {
            html += "<a href='http://oka.todo.vn/khach-san/"+ data.data[i].slug +"/"+ data.data[i].id +"' target='_blank' style='color: blue; text-decoration: underline;'>";
            html += "<img src='"+ data.data[i].img +"' style='position: absolute; left: 0; width: 100px; max-height:75px; border: 1px #d0d0d0 solid; padding: 3px'/><strong>";
        }else if (type == 'city'){
            html += "<a href='javascript:void(0)'>";
            html += "<img src='style/images/city.png' style='position: absolute; left: 0; width: 100px; max-height:75px;'/><strong>";
        }else if (type == 'travel'){
            html += "<a href='javascript:void(0)'>";
            html += "<img src='style/images/travel.png' style='position: absolute; left: 0; width: 100px; max-height:75px;'/><strong>";
        }else{
            html += "<a href='javascript:void(0)'>";
            html += "<img src='style/images/travel.png' style='position: absolute; left: 0; width: 100px; max-height:75px;'/><strong>";
        }
        html += data.data[i].name + "</strong></a>";
        html += "<p style='margin-bottom: 3px; margin-top: 3px;'>";
        for (var tu = 0; tu<data.data[i].star; tu++){
            html += "<i class='icon iStar'></i>";
        }
        html += "</p>";
        html += data.data[i].address +"</div>";
        rank = data.data[i].rank;

        marker = cm_createMarker(position, html, rank, type, map);
        marker.setMap(map);
        if (rank == 0 || type == 'city' || type == 'travel'){
            markerx = marker;
        }
    }
    if (load_type){
        setTimeout( function(){
            map.panTo(markerx.getPosition());
            google.maps.event.trigger(markerx,'click');
        }, 0);
    }
}

function cm_createMarker (position, html, rank, type, map){ // Thiết lập các điểm đánh dấu trên bản đồ
    var image = new google.maps.MarkerImage('style/images/hotel_2.png', new google.maps.Size(30, 35));
    if(type == 'city') {
        image = new google.maps.MarkerImage('style/images/map_pin22.png', new google.maps.Size(32, 32));
    } else if(type == 'travel') {
        image = new google.maps.MarkerImage('style/images/map_pin22.png', new google.maps.Size(32, 32));
    } else if(rank == 0 && type == 'hotel') {
        image = new google.maps.MarkerImage('style/images/hotel_2.png', new google.maps.Size(30, 35));
    } else {
        image = new google.maps.MarkerImage('style/images/hotel_2.png', new google.maps.Size(30, 35));
    }

    var marker = new google.maps.Marker({
        position: position,
        icon: image
    });

    google.maps.event.addListener(marker,'click',function() {
        var center = map.getCenter();
        cm_getHotelJSON(center.hb, center.ib, map);
        map.panTo(marker.getPosition());
        infowindow.close();
        infowindow.setContent(html);
        infowindow.open(map,marker);
    });
    return marker;
}